<template>
  <div id="life">
    <p>
      加载渲染过程： beforeCreate(父) —>
      created(父)—>beforeMount(父)—>beforeCreate(子)—>created(子)—>beforeMount(子)—>mounted(子)—>mounted(父)
    </p>
    <p>
      更新过程： beforeUpdate(父) —> beforeUpdate(子) —> updated(子) —>
      updated(父)
    </p>
    <p>
      销毁过程： beforeDestory(父) —> beforeDestory(子) —> destoryed(子) —>
      destoryed(父)
    </p>
  </div>
</template>

<script>
export default {
  name: "LifeDemo",
  beforeCreate() {
    console.log("子beforeCreate");
  },
  created() {
    console.log("子created");
  },
  beforeMount() {
    console.log("子beforeMount");
  },
  mounted() {
    console.log("子mounted");
  },
  beforeUpdate() {
    console.log("子beforeUpdate");
  },
  updated() {
    console.log("子updated");
  },
  beforeDestroy() {
    console.log("子beforeDestroy");
  },
  destroyed() {
    console.log("子destroyed");
  }
};
</script>
